<template>
  <div class="all">
      <ol>
        <li>{{$t('index.player')}}</li>
        <li>{{$t('index.fight')}}</li>
        <li>{{$t('index.amount')}}</li>
        <li>{{$t('index.profit')}}</li>
      </ol>
      <ul>
        <li v-for="(item,index) in records" :key="index+'allquiz'">
          <div>
            <div>
              <img src="" alt="">
            </div>
            <span>{{item.name}}</span>
          </div>
          <div>{{item.times}}{{$t("index.times")}}</div>
          <div>{{item.amount}}</div>
          <div>{{item.profit}}</div>
        </li>
      </ul>
      <div class="more" @click="more">
        {{$t('index.more')}}
      </div>
  </div>
</template>

<script>
export default {
  data(){
    return{
      records:[
        {name:'NNNNk国',times:'2.03',amount:'2.3456',profit:'2.2436'},
        {name:'NNNNk国',times:'2.03',amount:'2.3456',profit:'2.2436'},
        {name:'NNNNk国',times:'2.03',amount:'2.3456',profit:'2.2436'},
        {name:'NNNNk国',times:'2.03',amount:'2.3456',profit:'2.2436'},
        {name:'NNNNk国',times:'2.03',amount:'2.3456',profit:'2.2436'},
      ]
    }
  },
  methods:{
    more(){

    }
  }
}
</script>

<style lang="scss" scoped>
.all{
  >ol{
    display: flex;
    font-size: .12rem;
    justify-content: space-between;
    padding: 0 .15rem;
    margin-top: .15rem;
    line-height: 2.2;
    li{
      width: calc((100% - .3rem) / 4);
      text-align: center;
    }
  }
  >ul{
    margin-bottom: .15rem;
    li{
      padding: 0 .1rem;
      display: flex;
      font-size: .1rem;
      justify-content: space-between;
      border-top: solid 0.0033rem #445F74;
      height: .33rem;
      line-height: .33rem;
      >div{
        width: calc((100% - .2rem) / 4);
        display: flex;
        align-items: center;
        justify-content: center;
        >div{
          height: .16rem;
          width: .16rem;
          border-radius: 50%;
          background: #000000;
          margin-right: .05rem;
        }
      }
    }
  }
  .more{
    height: .3rem;
    margin: 0 .1rem;
    font-size: .13rem;
    text-align: center;
    background: #0A1722;
    line-height: .3rem;
  }
}
</style>